// Created by carolsail

import { ENUM_AUDIO_CLIP, ENUM_UI_TYPE } from "../Enum";
import { StaticInstance } from "../StaticInstance";
import { wxAvatar } from "../Utils";
import AudioManager from "../manager/AudioManager";
import DataManager from "../manager/DataManager";
import PoolManager from "../manager/PoolManager";
import ResourceManager from "../manager/ResourceManager";
import SdkManager from "../manager/SdkManager";
import ToastManager from "../manager/ToastManager";
import UIScrollControl from "../plugins/UIScrollControl";
import { IRoom } from "../shared/common/types";
import BaseLayer from "./Baselayer";

const { ccclass, property } = cc._decorator;

@ccclass
export default class HallLayer extends BaseLayer {

    panel: cc.Node = null
    btnClose: cc.Node = null
    btnCreate: cc.Node = null
    btnJoinNum: cc.Node = null
    scrollNode: cc.Node = null
    scrollItem: cc.Node = null

    onLoad() {
        this.panel = cc.find('style/panel', this.node)
        this.btnClose = cc.find('btn_close', this.panel)
        this.btnCreate = cc.find('buttons/btn_create', this.panel)
        this.btnJoinNum = cc.find('buttons/btn_join_num', this.panel)
        this.btnClose.on('click', this.onCloseClick, this)
        this.btnCreate.on('click', this.onCreateClick, this)
        this.btnJoinNum.on('click', this.onJoinNumClick, this)
        this.scrollNode = cc.find('scroll', this.panel)
        this.scrollItem = PoolManager.instance.getNode('HallItem')
        // DataManager.instance.wsClient.listenMsg('GameRefresh', ({ type, content }) => {
        //     if (type == 'msg_hall_refresh') {
        //         this.rendor(content)
        //     }
        // })
    }

    onDestroy() {
        this.btnClose.off('click', this.onCloseClick, this)
        this.btnCreate.off('click', this.onCreateClick, this)
        this.btnJoinNum.off('click', this.onJoinNumClick, this)
        // DataManager.instance.wsClient.unlistenMsgAll('GameRefresh')
    }

    onEnable() {
        this.zoomIn(this.panel)
        this.connect()
    }

    onDisable() { }

    connect() {
        DataManager.instance.wsClient.callApi('Connect', { user: DataManager.instance.user })
    }

    unconnect() {
        DataManager.instance.wsClient.callApi('ConnectLeave', { user: DataManager.instance.user })
    }

    rendor({ rooms }) {
        if (!StaticInstance.uiManager.isActive(ENUM_UI_TYPE.HALL)) return
        let isScrollToTop = false
        this.scrollNode.getComponent(UIScrollControl).init(this.scrollItem, rooms.length, cc.size(500, 130), 0, (node: cc.Node, index: number) => {
            if (!isScrollToTop) {
                isScrollToTop = true
                this.scrollNode.getComponent(cc.ScrollView).scrollToTop()
            }
            const item = rooms[index]
            // 房主
            const player = item.players[0]
            // 头像
            const avatar = node.getChildByName('avatar')
            const icon = avatar.getChildByName('icon')
            if (player.avatar) {
                wxAvatar(player.avatar).then((texture: any) => {
                    icon.getComponent(cc.Sprite).spriteFrame = new cc.SpriteFrame(texture)
                })
            } else {
                icon.getComponent(cc.Sprite).spriteFrame = ResourceManager.instance.getSprite('222')
            }
            // 名称
            const main = node.getChildByName('main')
            const nickname = main.getChildByName('nickname')
            const roomid = main.getChildByName('roomid')
            nickname.getComponent(cc.Label).string = `${player.nickname}`
            roomid.getComponent(cc.Label).string = `房号:${item.id}`
            // 加密
            const icon_lock = node.getChildByName('icon_lock')
            icon_lock.active = item.password == '' ? false : true
            // 按钮事件
            const btnJoin = node.getChildByName('btn_join')
            if (!btnJoin.hasEventListener('click')) {
                btnJoin.on('click', () => { this.onItemClick(item) }, this)
            } else {
                btnJoin.off('click')
                btnJoin.on('click', () => { this.onItemClick(item) }, this)
            }
        }, (scroll: cc.ScrollView) => {
            scroll.scrollToTop()
        })
    }

    onCloseClick() {
        AudioManager.instance.playSound(ENUM_AUDIO_CLIP.CLICK)
        StaticInstance.uiManager.toggle(ENUM_UI_TYPE.HALL, false)
        StaticInstance.uiManager.toggle(ENUM_UI_TYPE.MENU)
        this.unconnect()
    }

    onCreateClick() {
        AudioManager.instance.playSound(ENUM_AUDIO_CLIP.CLICK)
        SdkManager.instance.showVideoAd(() => {
            StaticInstance.uiManager.toggle(ENUM_UI_TYPE.HALL, false)
            StaticInstance.uiManager.toggle(ENUM_UI_TYPE.ROOM_CREATE)
        }, () => {
            ToastManager.instance.show('视频播放中断', { gravity: 'TOP', bg_color: cc.color(226, 69, 109, 255) })
        })
    }

    onJoinNumClick() {
        AudioManager.instance.playSound(ENUM_AUDIO_CLIP.CLICK)
        StaticInstance.uiManager.toggle(ENUM_UI_TYPE.HALL, false)
        StaticInstance.uiManager.toggle(ENUM_UI_TYPE.ROOM_JOIN_NUM)
    }

    async onItemClick(item: IRoom) {
        if (item.password) {
            DataManager.instance.room = item
            StaticInstance.uiManager.toggle(ENUM_UI_TYPE.HALL, false)
            StaticInstance.uiManager.toggle(ENUM_UI_TYPE.ROOM_JOIN)
        } else {
            // 直接加入
            const data = await DataManager.instance.wsClient.callApi('RoomJoin', { roomId: item.id, player: DataManager.instance.user })
            if (!data.isSucc) {
                ToastManager.instance.show(data.err.message, { gravity: 'TOP', bg_color: cc.color(226, 69, 109, 255) })
                return
            }
            DataManager.instance.room = data.res.room
            StaticInstance.uiManager.toggle(ENUM_UI_TYPE.HALL, false)
            StaticInstance.uiManager.toggle(ENUM_UI_TYPE.ROOM)
        }
    }
}
